<template>
  <div id="app">
    <iframe src="http://localhost:8080" style="width:0px;height:0px;display:none"></iframe>
    <Home :isGetMessage="isGetMessage" />
    <Loading :visible="!isGetMessage"></Loading>
  </div>
</template>

<script>
import Home from './views/Home.vue'
import Loading from './views/Loading.vue'
export default {
  name: 'App',
  data() {
    return {
      isGetMessage: false // 是否接收到IDP的消息
    }
  },
  components: {
    Home,
    Loading
  },
  methods: {
    // 接收到message的回调
    messageHandler(e) {
      const { type = '', token = '' } = e.data || {}
      if (type == 'sso-token-login' && token) {
        localStorage.setItem('token', e.data.token);
        this.isGetMessage = true
      } else if (type == 'sso-token-nologin') {
        this.isGetMessage = true
      }
    }
  },
  mounted() {
    document.title = '淘宝';
    window.addEventListener('message', this.messageHandler)
  },
  beforeDestroy() {
    window.removeEventListener('message', this.messageHandler);
  }
}
</script>

<style>
body {
  margin: 0
}
</style>
